<template>
  <div class="detaillist">
    <div class="left">
      <div class="item" v-for="(item,i) in datas" :key="i">{{item.nav}}</div>
    </div>
    <div class="right">
      <div class="item" v-for="(item,ind) in datas[0].content" :key="ind">
        <div class="img">
          <img :src="item.pic" alt />
        </div>
        <div class="text">
          <div class="name">{{item.name}}</div>
          <div class="xq">{{item.xq}}</div>
          <div class="price">￥{{item.price}}</div>
        </div>
        <div class="btn">
          <span>+</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { mapState } from "vuex";

export default {
  computed: {
    ...mapState(["datas"])
  }
};
</script>

<style>
</style>